<% @rand = rand(2) %>
<% if(@rand == 1)
  @background = ' style="background:url(\'/images/banner.jpg\');"'
  @style = ' style="filter:alpha(opacity=0); opacity:0; -moz-opacity:0; -khtml-opacity:0;";'
end %>
<div id='menu'<%=raw @background%>> 
  <div class="container">
    <div id="hero"<%=raw @style%>><img src="/images/home-hero.png" alt="天天笔记" data-pinit="registered"></div>
    <div class="slogan"><h1>天天笔记</h1><small>一款风格简洁、操作方便、体验良好的免费网络在线记事本|专门针对电信和联通进行优化，加快数据访问速度|高质量硬盘、定期数据备份，用户数据加密，支持数据导出|文档共享功能，方便您将信息分享给家人、同事、或朋友们|支持手机在线访问，随时随地浏览及编辑、速度快、节省流量</small><p>
      <% if(session[:user] == nil) %>
      <a href="/user/reg/" class="button noline">立即注册</a>
      <% else %>
      <a href="/doc/" class="button noline">开始使用</a>
      <% end %>
      </p></div>
  </div>
</div>
<div id='content'>
  <div class="container">
    <ul>
      <li>
        <h2>文档</h2>
        <p>您的生活、工作、学习笔记</p>
      </li>
      <li>
        <h2>便笺</h2>
        <p>记录一些简短的文字</p>
      </li>
      <li>
        <h2>备份</h2>
        <p>支持导出功能、方便备份</p>
      </li>
      <li class="last">
        <h2>手机</h2>
        <p>手机在线浏览、随时随地使用</p>
      </li>
    </ul>
  </div>
</div>

<script type="text/javascript">
$(document).ready(function(){
  var index = 0;
  var arr = $('#menu small').html().split('|');
  $('#menu small').html('');
  $(arr).each(function(index, item){
    $('#menu small').append('<span style="display:none;">' + item + '</span>');
  });

  showTip();
  setInterval(showTip, 6000);
  <%if(@rand == 1)%>
  setTimeout(function(){
    $('#hero').fadeTo(2500, 1);
  }, 1500);
  <%end%>
});

// 呈现个性化文字
var tipIndex = -1;
function showTip() {
  var list = $('#menu small span');
  tipIndex ++;
  if(tipIndex >= list.length)
    tipIndex = 0;
  list.hide();
  $('#menu small span:eq('+ tipIndex +')').fadeIn(800);
}
</script>